<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../font/iconfont.css">
    <link rel="stylesheet" href="../font/iconfont.ttf">
    <link rel="stylesheet" href="../css/plant.css">
    <link rel="stylesheet" href="../css/index.css">
    <link rel="stylesheet" href="../font/font.css">
    <link rel="stylesheet" href="../lib/bootstrap-3.3.5-dist/css/bootstrap.min.css">
    <script src="../lib/bootstrap-3.3.5-dist/js/jquery-1.11.3.js"></script>
    <script src="../lib/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="../css/pick.css">
</head>

<body>
    <script src="../lib/jquery-1.11.3.js"></script>
    <script src="../lib/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>

    <div id="zhe">
        <div id="tan">
            <h1>真的要删除吗？</h1>
            <hr>
            <button id="quxiao2">取消</button>
            <button id="que2">确定</button>
        </div>
    </div>
    <div class="container-fluid">
        <div class="row">
            <!-- 这是侧边栏 -->
            <div id="kong" class="col-md-2"></div>
            <div id="main_menu" class="col-md-2">
                <ul id="myul">
                    <li id="logoli">
                        <div><span class="iconfont icon-shouyefill"></span><a href="../index.html">首页</a>
                        </div>
                    </li>
                    <li id="have">
                        <div><span class="iconfont icon-tongji"></span>统计</div>
                        <ul>
                            <li><a href="../pages/zx_tongji.html">种植收购统计</a></li>
                            <li><a href="../pages/saleStatistical.html">销售统计</a> </li>
                            <li><a href="../pages/dj03.html">人员统计</a> </li>
                        </ul>
                    </li>
                    <li>
                        <div><span class="iconfont icon-zhongzhiguanli"></span>种植养殖</div>
                        <ul>
                            <li><a href="../pages/plant.html">蔬果</a></li>
                            <li><a href="../pages/farming.html">肉类</a></li>
                        </ul>
                    </li>
                    <li>
                        <div><span class="iconfont icon-caigou"></span>采购收购</div>
                        <ul>
                            <li><a href="../pages/Supplier_management.html">供应商管理</a> </li>
                            <li><a href="../pages/pick_fruit.html">蔬果</a></li>
                        </ul>

                    </li>
                    <li>
                        <div><span class="iconfont icon-yunshuzhongwuliu-xianxing"></span>运输</div>
                        <ul>
                            <li><a href="../pages/tran_meat.html">肉类运输</a></li>
                            <li><a href="../pages/tran_ve.html">蔬菜运输</a></li>
                        </ul>

                    </li>
                    <li>
                        <div><span class="iconfont icon-xinruku"></span>仓库 </div>
                        <ul>
                            <li><a href="../pages/stockIn.html">入库</a></li>
                            <li><a href="../pages/stockOut.html">出库</a></li>
                        </ul>

                    </li>
                    <li>
                        <div><span class="iconfont icon-shejishengchan"></span><a href="../pages/production.html">生产</a>
                        </div>
                    </li>
                    <li>
                        <div><span class="iconfont icon-xiaoshou" id="logo"></span>销售</div>
                        <ul>
                            <li><a href="../pages/zx_xiaoshou.html">销售流通</a></li>
                            <li><a href="../pages/online_sho_by.html">网购</a></li>
                            <li><a href="../pages/online_retreate.html">网购-退换记录</a></li>
                            <li><a href="../pages/zx_pima.html">批码管理</a></li>
                        </ul>

                    </li>
                    <li>
                        <div><span class="iconfont icon-lajitong"></span><a
                                href="../pages/waste_management.html">废料去向</a></div>
                    </li>
                    <li>
                        <div><span class="iconfont icon-guanliyuan"></span>管理</div>
                        <ul id="secondary">
                            <li><a href="../pages/dj01.html">人员管理</a> </li>
                            <li><a href="../pages/dj02.html">操作日志</a> </li>
                            <li><a href="../pages/board.html">留言板</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
            <div id="left_content" class="col-md-10">
                <!-- 这是头 -->
                <nav id="main_headnav">
                    <div class="clear">
                        <div class="navlefspan">
                            <span class="iconfont icon-caidan" id="hidenmenu"></span>
                            <span class="mytitle">食品流通安全管理系统</span>
                        </div>
                        <div class="navrigspan">
                            <span class="iconfont icon-tixing" id="tx"></span>
                            <!-- 头像 -->
                            <img src="../images/shouye/tx.jpg" alt="">
                            <!-- 姓名 -->
                            <span id="tc">退出</span>
                        </div>
                    </div>
                    <div>
                        <!-- 这里写小的头 -->
                    </div>
                </nav>
                <div id="main_content">
                    <div id="mycentent">
                        <div id="box">
                            <div id="main">
                                <p id="mynav"><span>网购-退换记录</span></p>
                                <div id="add">
                                    <span>网购-退换记录</span>
                                    <!-- <button data-toggle="modal" data-target="#exampleModal" id="xinzeng">新增</button> -->
                                </div>
                                <div id="search" class="row ">
                                    <span>用户id</span><input type="text" placeholder="请输入" id="p_item">
                                    <button id="chaxun">查询</button>
                                    <button id="chongzhi">重置</button>
                                </div>
                                <table class="table table-bordered" id="mytable">
                                    <thead>
                                        <tr>
                                            <th>销售单号</th>
                                            <th>用户id</th>
                                            <th>数量</th>
                                            <th>销售价</th>
                                            <th>用户名称</th>
                                            <th>用户手机号</th>
                                            <th>操作</th>
                                        </tr>
                                    </thead>
                                    <tbody id="mytbody">
                                    </tbody>
                                </table>
                            </div>
                            <div id="paging" class="clear">
                                <div>
                                    跳至
                                    <input type="text" placeholder="5" id="jump">
                                    页
                                </div>
                                <div>
                                    <select name="" id="amount">
                                        <option value="10">10条/页</option>
                                        <option value="20">20条/页</option>
                                        <option value="30">30条/页</option>
                                    </select>
                                </div>
                                <div class="clear" id="page">
                                    <div>
                                        <p class="iconfont">&#xe630</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 模态框 -->
    <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" >
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel">增加采购记录</h4>
                </div>
                <div class="modal-body">
                    <form id="mymyform">
                        <p id="s1"></p>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal" id="quxiao">取消</button>
                    <button type="button" class="btn btn-primary" data-dismiss="modal" id="queding">确定</button>
                </div>
            </div>
        </div>
        </div>
    

    <script src="../js/index.js">
    </script>
    <script src="../js/online_retreat.js"></script>

</body>
<script>
    window.onload = function () {
        let x = $("#box").width()
        $('#box').width(x)
    }

    let mydata = [];
    // 获取表格数据
    $.ajax({
        url:"/online_retreat_render",
        method:"post",
        // 获取到了数据，然后将其渲染进表格
        success:(res)=>{
            mydata = res;
            // 执行渲染表格的函数
            Render({
                page:1,
                num:10,
                data:res
            });
            // 执行渲染页码的函数
            Page({
                page:1,
                num:10,
                data:res
            });
            // 执行页码的点击事件
            page2();

        }
    })


    // 查询数据
    let p_item = "";
    let p_num = "";
    $("#chaxun").on("click",()=>{
        p_item = $("#p_item").val();

        $.ajax({
            url:'/online_retreat_query',
            method:'post',
            data:{
                p_item:p_item,
            },
            success:(res)=>{
                // 执行渲染表格的函数
                Render({
                    page:1,
                    num:amount,
                    data:res
                });
                // 执行渲染页码的函数
                Page({
                    page:1,
                    num:amount,
                    data:res
                });
            }
        })
    })
</script>


</html>